<template>
  <!-- 主页轮播图 -->
  <swiper :options="swiperOptions">
    <swiper-slide v-for="(item,i) in picList" :key="i">
      <img :src="item.src" width="100%" height="130px" />
    </swiper-slide>
    <div class="swiper-pagination" slot="pagination"></div>
  </swiper>
</template>

<script>
// import 'swiper/dist/css/swiper.css'    //在全局没引入，这里记得要！
// import { swiper, swiperSlide } from 'vue-awesome-swiper'
export default {
  data() {
    return {
      swiperOptions: {
        pagination: ".swiper-pagination", // 轮播图的点
        loop: true, //循环 (图片无缝)
        autoplay: 3000, //多长时间换图
      },
      picList: [
        {
          id: 0,
          src:
            "https://gtms01.alicdn.com/tps/i1/T1Ww_JFEpdXXcZd9sr-640-200.png",
        },
        {
          id: 1,
          src:
            "https://gw.alicdn.com/imgextra/i3/149/O1CN01wekXPw1CyHZ23AC4R_!!149-0-lubanu.jpg",
        },
      ],
    };
  },
};
</script>

